import { Meta } from '@storybook/addon-docs';

<Meta title="Packages/@my/mobx-rootstore" />

### RootStore、RootStoreProvider

```typescript
import { RootStore, RootStoreProvider } from '@my/mobx-rootstore';

const rootStore = new RootStore()

function MyApp() {
  const hydrationData = {...}
  return (
    <RootStoreProvider store={rootStore} hydrationData={hydrationData}>
      {...}
    </RootStoreProvider>
  );
}

```

### Store

- 必须以 rootStore 作为构造函数

```typescript
import { makeAutoObservable } from 'mobx';
import { RootStore } from '@my/mobx-rootstore';

import menus from './menus';

export class CounterStore {
  count = 0;

  otherStore: OtherStore;

  constructor(private rootStore: RootStore) {
    makeAutoObservable(this);
    this.otherStore = this.rootStore.getStore(OtherStore);
  }
}
```

### useStore

获取指定 store

```typescript
import { useStore } from '@my/mobx-rootstore';

function SomeComponent() {
  const counterStore = useStore(CounterStore);

  // 指定 key， 默认 defaut
  const counterStore = useStore(CounterStore, 'some-key');

  // 更多选项
  //
  const counterStore = useStore(CounterStore, {
    key: 'some-key',
    // 自定义创建 store
    creator: (rootStore) => new CounterStore(rootStore, { name: 'hello' }),
  });

  return <div>Hello</div>;
}
```

### useRootStore

获取 rootStore

```typescript
import { useRootStore } from '@my/mobx-rootstore';

function SomeComponent() {
  const rootStore = useRootStore();

  return <div>Hello</div>;
}
```

### RootStore

```typescript
/**
  * 获取 Store
  * 如果已经存在则返回已存在 store
  * 不存在则创建一个新的，并 register 到 rootStore
  *
  * @param StoreClass 指定 Store
  * @param storeKey 可选，默认为 "default"
  */
  getStore<S>(StoreClass: StoreClass<S>, storeKey?: string) => S


  /**
   * 注册 Store
   *
   * @param store
   * @param storeKey 可选，默认为 "default"
   */
  register(StoreClass: StoreClass, store: BaseStore, storeKey?: string) => () => void

  /**
   * 注销
   *
   * @param store
   */
  unregister(store: BaseStore) => void
```
